import React, { Component } from 'react';
import axios from 'axios';
import { Form, Input, Message } from '@alifd/next';
import IceContainer from '@icedesign/container';

const FormItem = Form.Item;
const formItemLayout = {
  labelCol: { fixedSpan: 3 },
  wrapperCol: { span: 20 }
};

class Verified extends Component {
  constructor(props) {
    super(props);
    this.state = ({
      isVerified: false,
      userId: ''
    });
    const userId = localStorage.getItem("id");
    this.init(userId);
  }

  init = (userId) => {
    axios.get('http://localhost:9080/user/id-info?id='+userId, {
      headers: {
        'Authorization': "Bearer " + localStorage.getItem("access_token")
      }
    }).then((res) => {
      let isVerified = res.data.status === 1 ? true : false;
      this.setState({
        isVerified: isVerified,
        userId: userId
      });
    }).catch(() => {
      console.log('error');
    });
  }

  handleSubmit = (values, errors) => {
    if(errors) {
      console.log(errors);
      return;
    }
    console.log('Get form value:', values);
    axios.get('http://localhost:9080/user/verified?idCard='+values.idNumber+'&name='+values.realName+'&id='+this.state.userId, {
      headers: {
        'Authorization': "Bearer " + localStorage.getItem("access_token")
      }
    }).then((res) => {
      Message.success('实名认证成功！');
      this.setState({
        isVerified: true
      });
    }).catch(() => {
      Message.warning('实名认证失败，请联系管理员或稍后再试');
      console.log('error');
    });
  };

  render() {
    if(this.state.isVerified) {
      return (
        <IceContainer>
          您已经实名认证
        </IceContainer>
      );
    }
    return (
      <IceContainer style={{ height: "600px" }}>
        <Form style={{ width: "400px", margin: "150px auto" }} {...formItemLayout} labelTextAlign="left" size="large" labelAlign="inset" >
          <FormItem label="真实姓名" required asterisk={false}>
              <Input name="realName" trim defaultValue="张三" />
          </FormItem>
          <FormItem label="身份证ID" required asterisk={false}>
              <Input name="idNumber" trim defaultValue="" />
          </FormItem>
          <FormItem label=" ">
              <Form.Submit style={{ width: '100%', backgroundColor: '#336666' }} type="primary" validate onClick={this.handleSubmit}>提交</Form.Submit>
          </FormItem>
        </Form>
      </IceContainer>
    );
  }
}

export default Verified;